<form
  id="edit-form"
  class="form-horizontal"
  role="form"
  data-toggle="validator"
  method="POST"
  action=""
>
  <div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">{:__('Name')}:</label>
    <div class="col-xs-12 col-sm-8">
      <input
        id="c-name"
        data-rule="required"
        class="form-control"
        name="row[name]"
        type="text"
        value="{$row.name|htmlentities}"
      />
    </div>
  </div>
  <div class="form-group">
    <label class="control-label col-xs-12 col-sm-2"
      >{:__('Dish_category')}:</label
    >
    <div class="col-xs-12 col-sm-8">
      <input
        id="c-category_id"
        data-rule="required"
        data-source="category/selectpage"
        data-params='{"custom[type]":"dish"}'
        class="form-control selectpage"
        name="row[category_id]"
        type="text"
        value="{$row.category_id|htmlentities}"
      />
    </div>
  </div>
  <div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">{:__('Price')}:</label>
    <div class="col-xs-12 col-sm-8">
      <input
        id="c-price"
        class="form-control"
        step="0.01"
        name="row[price]"
        type="number"
        value="{$row.price|htmlentities}"
      />
    </div>
  </div>

  <div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">口味做法配置：</label>
    <div>
      <div style="display: flex">
        <div class="ol-xs-12 col-sm-8" style="flex: 1; padding-right: 0">
          <p>口味名</p>
        </div>
        <div class="ol-xs-12 col-sm-8" style="padding-left: 0">
          <p>口味标签</p>
        </div>
      </div>
      {if condition="!empty($flavorList)"} {volist name="flavorList" id="vo"}
      <div class="fl-item" data-id="{$key}">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="dish-config" style="display: flex; margin-bottom: 10px">
          <div style="margin-right: 10px">
            <input
              data-rule="required"
              data-source="dish_flavor/selectpage"
              class="form-control selectpage"
              name="row[dish_flavor][{$key}][key]"
              type="text"
              data-id="{$key}"
              value="{$vo.nameIndex}"
              data-params='{"custom[index]":"{$vo.nameIndex}"}'
            />
          </div>
          <div style="flex: 1">
            <input
              data-rule="required"
              data-source="dish_flavor/selectpage"
              class="form-control selectpage"
              name="row[dish_flavor][{$key}][val][]"
              type="text"
              data-id="fl{$key}"
              value="{$vo.valueIndexs}"
              data-multiple="true"
              data-params='{"custom[key]":"{$vo.name}"}'
            />
          </div>
          <a
            data-id="{$key}"
            style="margin-left: 10px"
            href="javascript:;"
            class="btn btn-danger btn-del btn-disabled"
            title="删除"
            ><i class="fa fa-trash"></i> 删除</a
          >
        </div>
      </div>
      {/volist} {/if}

      <div id="dishConfigBottom">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="ol-xs-12 col-sm-8" style="padding-left: 0">
          <a
            id="addDishFlavor"
            href="javascript:;"
            class="btn btn-success btn-add"
            title="添加口味"
            ><i class="fa fa-plus"></i> 添加口味</a
          >
        </div>
      </div>
    </div>
  </div>
  <div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label>
    <div class="col-xs-12 col-sm-8">
      <div class="input-group">
        <input
          id="c-image"
          class="form-control"
          size="50"
          name="row[image]"
          type="text"
          value="{$row.image|htmlentities}"
        />
        <div class="input-group-addon no-border no-padding">
          <span
            ><button
              type="button"
              id="faupload-image"
              class="btn btn-danger faupload"
              data-input-id="c-image"
               data-mimetype="image/jpeg,image/png,image/jpg"
              data-multiple="false"
              data-preview-id="p-image"
               data-maxsize="2M"
            >
              <i class="fa fa-upload"></i> {:__('Upload')}
            </button></span
          >
          <span
            ><button
              type="button"
              id="fachoose-image"
              class="btn btn-primary fachoose"
              data-input-id="c-image"
              data-mimetype="image/jpeg,image/png,image/jpg"
              data-multiple="false"
              data-maxsize="2M"
            >
              <i class="fa fa-list"></i> {:__('Choose')}
            </button></span
          >
        </div>
        <span class="msg-box n-right" for="c-image"></span>
      </div>
      <div style="display: flex; margin-top: 10px; align-items: center">
        <ul
          class="row list-inline faupload-preview"
          id="p-image"
          data-template="imagetpl"
          style="min-width: 130px"
        ></ul>
        <div style="margin-left: 10px">
          <p>图片大小不超过2M</p>
          <p>仅能上传PNG JPG JPEG类型图片</p>
          <p>建议上传200*200或300*300尺寸的图片</p>
        </div>
      </div>
      <!-- <ul class="row list-inline faupload-preview" id="p-image"></ul> -->
    </div>
  </div>
  <div class="form-group">
    <label class="control-label col-xs-12 col-sm-2"
      >{:__('Description')}:</label
    >
    <div class="col-xs-12 col-sm-8">
      <textarea
        id="c-description"
        class="form-control"
        rows="5"
        name="row[description]"
        cols="50"
      >
{$row.description|htmlentities}</textarea
      >
    </div>
  </div>
  <div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">{:__('Status')}:</label>
    <div class="col-xs-12 col-sm-8">
      <div class="radio">
        {foreach name="statusList" item="vo"}
        <label for="row[status]-{$key}"
          ><input id="row[status]-{$key}" name="row[status]" type="radio"
          value="{$key}" {in name="key" value="$row.status"}checked{/in} />
          {$vo}</label
        >
        {/foreach}
      </div>
    </div>
  </div>
  <div class="form-group layer-footer">
    <label class="control-label col-xs-12 col-sm-2"></label>
    <div class="col-xs-12 col-sm-8">
      <button type="submit" class="btn btn-primary btn-embossed disabled">
        {:__('OK')}
      </button>
    </div>
  </div>
</form>

<!-- 自定义图片预览模版 -->
<script type="text/html" id="imagetpl">
  <li class="col-xs-12" style="margin-top: 0;">
    <a
      href="<%=fullurl%>"
      data-url="<%=url%>"
      target="_blank"
      class="thumbnail"
    >
      <img src="<%=fullurl%>" class="img-responsive" />
    </a>
    <a href="javascript:;" class="btn btn-danger btn-xs btn-trash"
      ><i class="fa fa-trash"></i
    ></a>
  </li>
</script>
